(function () {
    const oEchart = echarts.init(document.getElementById('yuan_huan01'), 'dark');
    const centerArr = [
        ['18%','40%'],
        ['50%','40%'],
        ['82%','40%'],
        ['34%','75%'],
        ['66%','75%'],
    ]
    const colors = [
        ['#4FF778', '#0BA82C'],
        ['#E5DD45', '#E8B11C'],
        ['#E8821C', '#E55445'],
        ['#5052EE', '#AB6EE5'],
        ['#23E5E5', '#2E72BF']
    ]
    oEchart.setOption({
        series: centerArr.map((item, index) => {
            return {
                name: 'Access From',
                type: 'pie',
                radius: [40, 50], //半径 设置为数组时，显示为空心饼图
                data: [
                    { 
                        value: Math.random() * (1000 - 100) + 100, 
                        name: `a${index}`,
                        itemStyle: {
                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [ //线性渐变
                                {
                                    offset: 0,
                                    color: colors[index][0]
                                },
                                {
                                    offset: 1,
                                    color: colors[index][1]
                                }
                            ])
                        } 
                    },
                    { 
                        value: Math.random() * (1000 - 100) + 100, 
                        name: `b${index}`, //饼图是顺时针渲染的，所以第一个在右边，第二个在左边
                        itemStyle: {
                            color: '#333843'
                        } 
                    }
                ],
                center: item, //设置不同位置的中心点
                labelLine: {
                    show: false //隐藏线条
                },
                label: {
                    position: 'center' //文字的位置
                }
            }
        })
    })
})()